<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>我的在线简历</title>
  <link rel="stylesheet" href="css/index.css">
  <link rel="stylesheet" href="//at.alicdn.com/t/font_2504842_70wduitje8m.css">
</head>
<body>
  <header>
    <img class="avatar" src="./imgs/avatar.png" alt="头像">
    <h1>小草</h1>
    <p>应聘前端工程师</p>
  </header>
  <main>
    <div class="column-1">
      <section class="basic-info">
        <span class="iconfont icon-user"></span>
        <h2>基本信息</h2>
        <ul class="detail">
          <li><span class="iconfont icon-phone"></span>13567733039</li>
          <li><span class="iconfont icon-wechat"></span>xiaocao</li>
          <li><span class="iconfont icon-email"></span>271492388@qq.com</li>
          <li><span class="iconfont icon-education"></span>专科</li>
        </ul>
      </section>
      <section class="skills">
        <span class="iconfont icon-skills"></span>
        <h2>掌握技能</h2>
        <ul class="detail">
          <li>掌握HTML5/CSS3，熟悉传统布局、Flex布局、Grid布局、移动端适配等</li>
          <li>熟悉Vue技术栈如Vue-Router、Vuex、Vue-CLI及相关流行库的使用，理解其重要概念1</li>
          <li>熟悉React / Redux技术栈等使用，能够使用React进行基本开发</li>
          <li>熟悉前后端交互技术JSONP、AJAX，了解fetch</li>
          <li>熟悉Node.js开发，能搭建基础后台开发</li>
        </ul>
      </section>
      <section class="map">
        <span class="iconfont icon-map"></span>
        <h2>技能图谱</h2>
        <dl class="detail">
          <dt>JavaScript</dt>
          <dd><span class="bar" style="width: 30%;"></span></dd>
          <dt>CSS3</dt>
          <dd><span class="bar" style="width: 65%;"></span></dd>
          <dt>Node</dt>
          <dd><span class="bar" style="width: 80%;"></span></dd>
          <dt>Vue</dt>
          <dd><span class="bar" style="width: 60%;"></span></dd>
          <dt>React</dt>
          <dd><span class="bar" style="width: 70%;"></span></dd>
        </dl>
      </section>
    </div>
    <div class="column-2">
      <section class="education layout-1">
        <span class="iconfont icon-education"></span>
        <h2>教育经历</h2>
        <ul class="detail">
          <li>
            <span class="timeline">09/2013~07/2017</span>
            <h3>电子科技大学</h3>
            <span class="subtitle">计算机专业</span>
            <p class="content">多次获得校一等奖学金，成绩排名专业前10%.</p>
          </li>
          <li>
            <span class="timeline">09/2013~07/2017</span>
            <h3>电子科技大学</h3>
            <span class="subtitle">计算机专业</span>
            <p class="content">多次获得校一等奖学金，成绩排名专业前10%.</p>
          </li>
        </ul>
      </section>
      <section class="jobs layout-1">
        <span class="iconfont icon-work"></span>
        <h2>工作经历</h2>
        <ul class="detail">
          <li>
            <span class="timeline">09/2013~07/2017</span>
            <h3>电子科技大学</h3>
            <span class="subtitle">饥人谷</span>
              <ul class="content">
                <li>
                  项目介绍： 该项目的目的是搭建线上学习平台，
                  把线下课堂的完整学习流程搬到线上，
                  平台包括课程展示、购买、直播、录播、作业、
                  权限管理、停课复课、试听等几十个大功能。
                  该项目采用前后分离的技术方案， 
                  我主要负责前端部分的开发。
                  项目前端部分使用Vue技术栈，
                  移动端平台使用自己实现的vue ui组件库。
                </li>
                <li>
                  技术栈：vue、vue-router、vuex、element-ui、
                  typescript、webpack、es6、移动端
                </li>
                <li>
                  项目成果: 项目支撑饥人谷日常教学活动、
                  运营活动的正常开展，支持数千学生的日常线上学习，
                  几十万用户的日常访问。
                </li>
              </ul>
          </li>
        </ul>
      </section>
      <section class="project layout-1">
        <span class="iconfont icon-project"></span>
        <h2>工作经历</h2>
        <ul class="detail">
          <li>
            <span class="timeline">09/2013~07/2017</span>
            <h3>写代码啦课程平台Web端项目</h3>
              <ul class="content">
                <li>
                  项目介绍： 该项目的目的是搭建线上学习平台，
                  把线下课堂的完整学习流程搬到线上，
                  平台包括课程展示、购买、直播、录播、作业、
                  权限管理、停课复课、试听等几十个大功能。
                  该项目采用前后分离的技术方案， 
                  我主要负责前端部分的开发。
                  项目前端部分使用Vue技术栈，
                  移动端平台使用自己实现的vue ui组件库。
                </li>
                <li>
                  技术栈：vue、vue-router、vuex、element-ui、
                  typescript、webpack、es6、移动端
                </li>
                <li>
                  项目成果: 项目支撑饥人谷日常教学活动、
                  运营活动的正常开展，支持数千学生的日常线上学习，
                  几十万用户的日常访问。
                </li>
              </ul>
          </li>
        </ul>
      </section>
    </div>
    
  </main>
</body>
</html>